// ************************************
<template>
<!-- 投标方案 -->
<div class="collect-plan" v-loading="loading">
    <template v-if="itemList && itemList.length > 0">
        <div class="items" v-for="item in itemList" :key="item.docname">
            <collect-item
            :data="item"
            :title="item.docname"
            :time="item.collecttime"
            :tagList="item.taglist"
            :tagName="'tagname'"
            :rowguid="item.guid"
            @collect="afterCollect"
            type="document"
            ></collect-item>
        </div>
    </template>

    <empty-list v-if="!itemList.length">
        <span>暂无数据</span>
    </empty-list>

    <div class="pagination">
        <my-pagination
        ref="page"
        v-model="tableData"
        :action="`${$store.state.api.tbUrl}/center/usercollects.json`"
        :loading.sync="loading"
        :search="pgData"
        :autoShow="false"
        ></my-pagination>
    </div>
</div>
    
</template>

<script>
import CollectItem from './item.vue';
import EmptyList from '@components/sys/empty-list';

export default {
    components:{CollectItem,EmptyList,},
    data() {
        return {
            loading:false,
            tableData:[],
            pgData: {
                pagesize: 5,   //5
                sortname:'addtime',
                type:'document'
            },
        }
    },
    computed: {
        itemList() {
            if(this.tableData.length > 0){
                let arr = this.tableData.map(function(val){
                    return {
                        ...val,
                        collectinfo:{
                            isoperated: true,
                        }
                    }
                })

                return arr
            }else{
                return []
            }
            
        }
    },
    methods: {
        afterCollect() {
            this.$refs.page.queryData();
            ShowMsg('取消成功', 'success', function() {})
        }
    },
}
</script>

<style lang="scss" scoped>
@import '@css/var.scss';    

.collect-plan{
    height: 442px;
    position: relative;
    overflow: hidden;
    .items {
        margin-top: 15px;

        &:first-child {
            margin-top: 0;
        }
        .title{
            font-size: 15px;
        }
    }
    .pagination {
        position: absolute;
        bottom: 0;
        right: 0;

        .my-pagination-con {
            text-align: right;
        }
    }

}
</style>